<template>
  <view class="container">
    <view class="header">
      <text class="title">药品详情</text>
    </view>

    <view class="container">
      <swiper class="swiper" :autoplay="true" :interval="3000" :duration="500" :circular="true" :indicator-dots="true" :current="current">
        <swiper-item v-for="(item, index) in images" :key="index">
          <view class="swiper-item">
            <image :src="item" class="slide-image"></image>
          </view>
        </swiper-item>
      </swiper>
    </view>

    <view class="content">

      <view class="info">
        <text class="price">¥136</text>
        <text class="discount-price">¥236</text>
        <text class="name">倍健 钙铁锌咀嚼片 1.2g*60片(3效同补)</text>
        <text class="manufacturer">厂商：特一药业集团股份有限公司</text>
      </view>
    </view>
    <view class="description">
      <text class="subtitle">药品说明</text>
      <br>
<!--      <text>请仔细阅读(特一布洛芬片 0.1g*100片)的作用说明，并在药师指导下购买和使用。</text>-->
    </view>

<!--    <view class="details">-->
<!--      <text class="subtitle">【药品名称】</text>-->
<!--      <br>-->
<!--      <text>通用名称：布洛芬片</text>-->
<!--      <br>-->
<!--      <text>英文名称：Ibuprofen Tablets</text>-->
<!--      <br>-->
<!--      <text>汉语拼音：Buluofen Pian</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【成份】</text>-->
<!--      <br>-->
<!--      <text>本品每片含布洛芬0.1克。辅料为：淀粉、预胶化淀粉、(低取代)羟丙纤维素、羧甲淀粉钠、二氧化硅(微粉硅胶)、硬脂酸镁、明胶、滑石粉、蔗糖、二甲硅油、川蜡。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【性状】</text>-->
<!--      <br>-->
<!--      <text>本品为糖衣片，除去包衣后显白色。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【作用类别】</text>-->
<!--      <br>-->
<!--      <text>本品为解热镇痛类非处方药药品。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【适应症】</text>-->
<!--      <br>-->
<!--      <text>用于缓解轻至中度疼痛如头痛、关节痛、偏头痛、牙痛、肌肉痛、神经痛、痛经。也用于普通感冒或流行性感冒引起的发热。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【规格】</text>-->
<!--      <br>-->
<!--      <text>0.1g</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【用法用量】</text>-->
<!--      <br>-->
<!--      <text>口服。12岁以上儿童及成人一次2片，若持续疼痛或发热，可间隔4~6小时重复用药1次，24小时不超过4次。儿童见下表。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【不良反应】</text>-->
<!--      <br>-->
<!--      <text>1.少数病人可出现恶心、呕吐、胃烧灼感或轻度消化不良、胃肠道溃疡及出血、转氨酶升高、头痛、头晕、耳鸣、视力模糊、精神紧张、嗜睡、下肢水肿或体重骤增。</text>-->
<!--      <br>-->
<!--      <text>2.罕见皮疹、过敏性肾炎、膀胱炎、肾病综合征、肾乳头坏死或肾功能衰竭、支气管痉挛。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【禁忌】</text>-->
<!--      <br>-->
<!--      <text>1.对其他非甾体抗炎药过敏者禁用。</text>-->
<!--      <br>-->
<!--      <text>2.孕妇及哺乳期妇女禁用。</text>-->
<!--      <br>-->
<!--      <text>3.对阿司匹林过敏的哮喘患者禁用。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【注意事项】</text>-->
<!--      <br>-->
<!--      <text>1.本品为对症治疗药，不宜长期或大量使用，用于止痛不得超过5天，用于解热不得超过3天，如症状不缓解，请咨询医师或药师。</text>-->
<!--      <br>-->
<!--      <text>2.1岁以下儿童应在医师指导下使用。</text>-->
<!--      <br>-->
<!--      <text>3.不能同时服用其他含有解热镇痛药的药品(如某些复方抗感冒药)。</text>-->
<!--      <br>-->
<!--      <text>4.服用本品期间不得饮酒或含有酒精的饮料。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【药物相互作用】</text>-->
<!--      <br>-->
<!--      <text>1.本品与其他解热、镇痛、抗炎药物同用时可增加胃应，并可能导致溃疡。</text>-->
<!--      <br>-->
<!--      <text>2.本品与肝素、双香豆素等抗凝药同用时，可导致凝血酶原时间延长，增加出血倾向。</text>-->
<!--      <br>-->
<!--      <text>3.本品与地高辛、甲氨蝶呤、口服降血糖药物同用时，能使这些药物的血药浓度增高，不宜同用。</text>-->
<!--      <br>-->
<!--      <text>4.本品与呋塞米(呋喃苯胺酸)同用时，后者的排钠和降压作用减弱；与抗高血压药同用时，也降低后者的降压效果。</text>-->
<!--      <br>-->
<!--      <text>5.如与其他药物同时使用可能会发生药物相互作用，详情请咨询医师或药师。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【药理作用】</text>-->
<!--      <br>-->
<!--      <text>本品能抑制前列腺素的合成，具有解热镇痛及抗炎作用。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【贮藏】</text>-->
<!--      <br>-->
<!--      <text>密封保存。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【包装】</text>-->
<!--      <br>-->
<!--      <text>塑料瓶包装。每瓶100片。</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【有效期】</text>-->
<!--      <br>-->
<!--      <text>18个月</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【执行标准】</text>-->
<!--      <br>-->
<!--      <text>《中国药典》2010年版二部</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【批准文号】</text>-->
<!--      <br>-->
<!--      <text>国药准字H44021099</text>-->
<!--      <br>-->
<!--      <text class="subtitle">【生产企业】</text>-->
<!--      <br>-->
<!--      <text>广东台城制药股份有限公司</text>-->
<!--      <br>-->
<!--    </view>-->
    <br>
  </view>
</template>

<script>
export default {
  data() {
    return {

      images: [
        'https://liuyulin.oss-cn-shanghai.aliyuncs.com/2025/MARCH/16/21/51/00c610d8-9cc5-4e4f-9fad-3da370431bb1.png',
        'https://liuyulin.oss-cn-shanghai.aliyuncs.com/2025/MARCH/16/21/51/00c610d8-9cc5-4e4f-9fad-3da370431bb1.png',
        'https://liuyulin.oss-cn-shanghai.aliyuncs.com/2025/MARCH/16/21/51/00c610d8-9cc5-4e4f-9fad-3da370431bb1.png'
      ], // 替换为你的图片地址
      current: 0 // 当前显示的幻灯片索引

      // 可以在这里添加数据
    };
  },
  methods: {
    // 可以在这里添加方法

  }
};
</script>

<style>

.container {
  width: 100%;
  padding: 16px;
  height: 200px; /* 根据需要调整轮播图的高度 */
}
.swiper {
  width: 100%;
  height: 100%;
}
.swiper-item {
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide-image {
  width: 100%;
  height: 100%;
}


.header {
  text-align: center;
  margin-bottom: 16px;
}
.title {
  font-size: 24px;
  font-weight: bold;
}
.content {
  display: flex;
  margin-bottom: 16px;
}
.image {
  width: 100px;
  height: 100px;
  background-color: #f0f0f0;
  margin-right: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
.info {
  flex: 1;
}
.price {
  color: red;
  font-size: 20px;
  margin-bottom: 4px;
}
.discount-price {
  color: #666;
  text-decoration: line-through;
  font-size: 16px;
  margin-left: 4px;
}
.name {
  font-size: 18px;
  margin-bottom: 4px;
}
.manufacturer {
  color: #666;
}
.description {
  margin-bottom: 16px;
}
.subtitle {
  font-weight: bold;
  margin-top: 8px;
}
.details {
  line-height: 1.6;
}
</style>
